import * as THREE from "three";
// import { Library, libraryState } from "./index";
import { Library, libraryState } from "./model_index";
import { Library as Library2 } from "./define_index";
import { OrbitControls } from "three/examples/jsm/controls/OrbitControls.js";
import { FirstPersonControls } from "three/examples/jsm/controls/FirstPersonControls.js";
import { PointerLockControls } from "three/examples/jsm/controls/PointerLockControls.js";
import { DefineControl } from "./control";

let isDefine = false;
// let isDefine = true;

export const initLibrary = () => {
  // 1、获取canvas
  const canvas = document.getElementById("library") as HTMLElement;
  // 2、场景
  const scene = new THREE.Scene();
  // scene.background = new THREE.Color(0xffffff);
  scene.background = new THREE.Color(0x88ccee);
  // scene.environment = new THREE.Color(0xffffff);
  const axesHelper = new THREE.AxesHelper(1000);
  scene.add(axesHelper);
  // 3、相机（透视）
  const camera = new THREE.PerspectiveCamera(
    75, //视角
    window.innerWidth / window.innerHeight, //aspect视锥长宽比
    0.1, //near
    10000 //far
  );
  camera.rotation.order = "YXZ"; //默认旋转顺序是 'XYZ',设置相机旋转的顺序的属性。这个属性指定了欧拉角（Euler angles）的旋转顺序
  // camera.lookAt(0, 0, 0);
  // camera.position.set(0, 1, 5);
  scene.add(camera);
  // 添加相机控件-轨迹-围绕目标
  // const controls = new OrbitControls(camera, canvas);
  // controls.enableDamping = true; // 是否有惯性
  // controls.enableZoom = true; // 是否可以缩放
  // // controls.enableZoom = false; // 采用鼠标滚轮
  // controls.minDistance = 10; // 最近和最远距离
  // controls.maxDistance = 2000;
  // controls.enablePan = true; // 开启右键拖动, 处理场景偏移问题
  // controls.keyPanSpeed = 10;
  // controls.keys = {
  //   LEFT: "ArrowLeft", //left arrow
  //   UP: "", // up arrow
  //   BOTTOM: "", // down arrow
  //   RIGHT: "ArrowRight", // right arrow
  //   // UP: 'ArrowUp', // up arrow
  //   // BOTTOM: 'ArrowDown' // down arrow
  // };
  // controls.listenToKeyEvents(window);
  // 添加相机控件-第一人称
  // const controls = new FirstPersonControls(camera, canvas);
  // controls.lookSpeed = 0.1; //鼠标移动速度
  // // controls.enabled = false;
  // controls.enabled = true;
  // controls.movementSpeed = 10; //相机移动速度
  // controls.lookVertical = false; //是否约束垂直环视
  // 添加相机控件-指针
  const controls = new PointerLockControls(camera, canvas);
  // scene.add(controls.getObject());
  // 自定义控制器
  let defineControl;
  if (isDefine)defineControl = new DefineControl(scene, camera);

  // 4、灯光
  const fillLight1 = new THREE.HemisphereLight(0x8dc1de, 0x00668d, 1.5);
  fillLight1.position.set(2, 1, 1);
  scene.add(fillLight1);

  const directionalLight = new THREE.DirectionalLight(0xffffff, 2.5);
  directionalLight.position.set(-5, 25, -1);
  directionalLight.castShadow = true;
  directionalLight.shadow.camera.near = 0.01;
  directionalLight.shadow.camera.far = 500;
  directionalLight.shadow.camera.right = 30;
  directionalLight.shadow.camera.left = -30;
  directionalLight.shadow.camera.top = 30;
  directionalLight.shadow.camera.bottom = -30;
  directionalLight.shadow.mapSize.width = 1024;
  directionalLight.shadow.mapSize.height = 1024;
  directionalLight.shadow.radius = 4;
  directionalLight.shadow.bias = -0.00006;
  scene.add(directionalLight);
  // 5、渲染器
  const renderer = new THREE.WebGLRenderer({ canvas });
  renderer.setSize(window.innerWidth, window.innerHeight);
  // 像素比（和浏览器一致）
  renderer.setPixelRatio(Math.min(window.devicePixelRatio, 2));
  // 背景色
  renderer.setClearColor(new THREE.Color(0xffffff), 1);
  // 6、模型
  let library;
  if (isDefine) {
    library = new Library2(scene, camera, defineControl);
  } else {
    library = new Library(scene, camera, controls);
  }
  // 7、动画
  const clock = new THREE.Clock();

  const start = () => {
    if (libraryState.tweenPosition) libraryState.tweenPosition.update();
    //指定每一帧更新时间
    if (!isDefine && !libraryState.spriteTarget)
      library.start(clock.getDelta());

    // 更新控制器
    // controls.update();
    // // controls.update(clock.getDelta());
    // if (isDefine) defineControl.update(clock.getDelta());

    // 渲染场景
    renderer.render(scene, camera);
    requestAnimationFrame(start);
  };
  start();

  window.addEventListener("resize", () => {
    // 更新宽高比
    camera.aspect = window.innerWidth / window.innerHeight;
    // 更新相机的投影矩阵
    camera.updateProjectionMatrix();

    renderer.setSize(window.innerWidth, window.innerHeight);
    // 设置像素比
    renderer.setPixelRatio(Math.min(window.devicePixelRatio, 2));
  });
};